Me han preguntado la forma de añadir un grupo de imágenes tipo avatar de manera que todas las imágenes queden centradas y de igual tamaño.
Supuestamente es algo parecido a un blogroll y por lógica irá añadido a la sidebar. Esto quiere decir que lo agregaremos como un elemento de página incluyendo el código en HTML/Javascript.
El efecto quedaría más o menos así, pudiendo modificar colores y tamaño.

Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@Gem@ Gem@


El código:

<div align="center"> <div style="padding: 10px; width: 180px; text-align: center;"><div style="border: 1px solid black; padding: 5px; width: 180px; text-align: center; background-color: rgb(245, 245, 245); font-size: 10px;"><div style="border: 1px solid silver;">
<img src="url-imagen" alt="Gem@ " title="Gem@ " border="0" height="32" width="32"/><a href="url-blog"><img src="url-imagen" alt="Gem@ " title="Gem@ " border="0" height="32" width="32"/><a href="url-blog"><img src="url-imagen" alt="Gem@ " title="Gem@ " border="0" height="32" width="32"/><a href="url-blog"><img src="url-imagen" alt="Gem@ " title="Gem@ " border="0" height="32" width="32"/><a href="url-blog"></div></div>
</DIV></div>

Modificaciones:

El tamaño es muy importante, nunca debe ser superior a nuestra sidebar de lo contrario quedaría desplazada hacia abajo. Donde width: 180px; lo sustituiremos por la medida de nuestra sidebar, en la plantilla Minima por ejemplo lo localizaremos en #sidebar-wrapper {

Donde border: 1px es el grosor del borde a mayor valor mayor grosor del borde.
solid es el tipo de borde aquí encontraréis algo más.También podemos sustituir el color del borde en black y silver.

En background-color: rgb(245, 245, 245); escogemos color de fondo, en font-size: 10px; tamaño de letra.

Sustituiremos Gem@ en alt="Gem@ " title="Gem@" para añadir el nombre que visionaremos al pasar el ratón sobre el avatar.

El tamaño del avatar lo modificamos en width="32" height="32"

Y por último "url-imagen" y "url-blog" para añadir la url del avatar y la url de la página enlazada.



!Suerte'
Marta Nieves Montero González

Sin duda alguna, tengo que venir más por aquí, mi estimada Gema.

¡Siempre me sorprendes!

¡Cuánta sabiduría tienes, mi niña! ¡Eres admirable!

Pero hoy, lamento no poder quedarme contigo un ratito y aprender y aprender de ti; hoy pasaba para saludarte y para decirte que tienes un regalo en mi blog esperándote.

¡Sí, sí,... ya sé que te preguntarás que voy hacer con tanto regalo! Pero, ¿quién te manda a ser tan brillante y admirable?

Son las personas como tú, las merecedoras de estos galardones y yo, con toda mi admiración, respeto y mi cariño quiero otorgártelo a ti.

Por favor, recíbelo con toda la ilusión, amor y consideración que tú me mereces.

¡Sé feliz, mi cómplice!

Vesta, desde mi corazón.

Responder
Jan

GENIAL!!
Ya lo he puesto en práctica.
Gema, quería decirte que llevo muy poco tiempo en Blogger y ando un poco perdido pero gracias a la ayuda de blogs como el tuyo me voy defendiendo.
Puse un enlace hacia Gem@BLOG para tenerte más cerca, si te molesta dímelo y lo borro ¿ok?
GRACIAS ;)

Responder
Carlos Pizcos

Hola madrina!!! aqui a cumplir tus deseos...jajajaja..hoy carga mejor que dias atras, pero sigue haciendo la parada. A mi me pasa igual y empiezo a creer que por ocultar la navbar pero por ahora no lo puedo asegurar porque no he tenido tiempo de probarlo. Me gustan los cambios aunque el menu que has puesto hace que cargues una nueva pagina, podrias usar la tabview y no cargarla...solo es una idea...saludos bloguera!!!

Responder
Carlos Pizcos

Dos cosas que se me olvidaban...jajajaja...cuando he puesto el "bubbles" en mis comments, pense ¿donde lo he visto antes? jajajaja y resulta que era aqui...jajajaja

me he dado cuenta que tienes algo alojado en widget...no se que mas... que retarda la carga...y sobre todo ( a mi me pasaba) lo de los ultimos comments....

Responder
Gem@

Por supuesto que recibo ese regalo con toda la ilusión del mundo. Gracias y mil veces gracias Vesta. Por cierto la página tardaba tanto en cargar que me ha impedido dejarte un comentario (mañana probaré para mirar si es tu blog o mi conexión)
Un abrazo ;)


Hola Jan bienvenido ;) espero que encuentres lo que necesites, si no es así házmelo saber que demos solución a tus necesidades.
Claro que no me molesta que me enlazaras todo lo contrario....:D

Hola ahijado, eliminar la navbar fue una de las primeras cosas que hice, y ese problema lo voy arrastrando más o menos un mes.
Tengo la sospecha que es el buscador oculto de Google y quiero probar a eliminarlo por si fuera eso (debo modificar la plantilla para hacerlo por eso le estoy dando largas)
El tabview está muy bien y tiene un efecto divino pero ocupa bastante espacio :(
Gracias por molestarte en visionar mi blog, ya sabes... ante los problemas uno recurre a la familia jajajajaja
Un abrazo :)

Responder
Jan

Gracias Gema, eres muy amable :) De momento pongo en práctica tus enseñanzas las cuales explicas tan bien que no hay lugar a dudas aunque es un placer el saber que puedo contar contigo a la hora de resolver un problema.
Un beso

Responder
Anónimo

lo siento si no es el sitio adecuado para preguntar esto.

en esta plantilla http://re1234.blogspot.com/

quiero estrechar la parte azul y naranja en el sentido vertical para que la palabra CONFIGURACION aparezca mas arriba, ¿que parte del codigo de la plantilla tengo que modificar?

muchas gracias.

Responder
Anónimo

¡FELICIDADES, GEMA!:

http://bitacoras.com/top/bitacoras/8

Muy merecido :-)

Responder
Gem@

Aquí estaré Jan ;)

Anónimo para estrecharla en vertical busca donde dice:
#header h1 { y modifica el valor padding:70px 0 30px;
por:
padding:20px 0 30px;
Eso hará que se estreche pero también dejará un espacio blanco de separación que quizás no te agrade, para disminuir ese espacio blanco ve a #header-wrapper { y sustituye:
min-height: 190px;
por
min-height: 190px
Mira en vista previa antes de guardar los cambios ;)

Gracias por el detalle de mantenerme al corriente Jaime ;)

Responder
La Blogueria

Hola! sigo con atención los cambios... ¿dónde ha ido a parar la cabecera? me encantan los links de navegación.

¡Venia a dejarte saludos y abrazos!

Responder
Gem@

!Hola Vane¡ me encanta verte por aquí de vez en cuando. Lo logo sigue en el mismo sitio de siempre, he cambiado el menú porque no me gustaba debajo del logo y seguramente tu visita fue en ese mismo momento que estaba haciendo el cambio :D
Ya me conoces un poco, me cansa ver siempre lo mismo y en el mismo lugar, así que ando moviendo muebles de un sitio para otro, ya veremos hasta cuando otra vez ... :D :D :D
Abrazos.

Responder
Gem@

Donde Lo logo era "El logo" jajajaja

Responder
La Blogueria

AAaaahh ahi la veo de nuevo... créeme que te comprendo: en casa puedo cambiar de sitio un jarrón 10 veces, mirar el efecto, y probablemente dejarlo donde estaba al principio... y peor aun con el blog! Pero es bonito decorar la vida, jeje.

Repito: me gusta. Muy buena la navegación y presentaciones.

Saludos Gema!

Responder
Gem@

Gracias Vane;)

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top